<template>
  <div class="moral-form">
    <el-form :model="form" label-width="120px" size="small">
      <el-form-item label="基础分" required>
        <el-input-number
          v-model="form.baseScore"
          :min="0"
          :max="20"
          placeholder="请输入基础分"
        />
      </el-form-item>

      <el-form-item label="荣誉加分项" required>
        <el-input-number
          v-model="form.bonus"
          :min="0"
          :max="5"
          placeholder="请输入加分项"
        />
      </el-form-item>

      <el-form-item label="扣分原因">
        <el-input
          v-model="form.deductionReason"
          placeholder='如无扣分，填"无"'
          clearable
        />
      </el-form-item>

      <el-form-item label="导师加分" required>
        <el-input-number
          v-model="form.tutorBonus"
          :min="0"
          :max="5"
          placeholder="请输入导师加分"
        />
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="handleSave">保存</el-button>
        <el-button @click="resetForm">重置</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import axios from 'axios'
import { ElMessage } from 'element-plus'

export default {
  name: 'MoralForm',
  data() {
    return {
      form: {
        baseScore: null,
        bonus: null,
        deductionReason: '无',
        tutorBonus: null
      }
    }
  },
  methods: {
    async handleSave() {
      const studentId = localStorage.getItem('studentId')
      if (!studentId) {
        ElMessage.error('未检测到登录学号，请重新登录')
        return
      }

      if (
        this.form.baseScore === null ||
        this.form.bonus === null ||
        this.form.tutorBonus === null ||
        this.form.deductionReason === null
      ) {
        ElMessage.error('请完整填写所有必填字段')
        return
      }

   
      const totalScore = Number(this.form.baseScore) + Number(this.form.bonus) + Number(this.form.tutorBonus)

      const payload = {
        studentId: Number(studentId),
        baseScore: this.form.baseScore,
        honorScore: this.form.bonus,
        advisorScore: this.form.tutorBonus,
        deductionDesc: this.form.deductionReason,
        totalScore: totalScore
      }

      try {
        const res = await axios.post('/api/moralscores', payload, {
          headers: { 'Content-Type': 'application/json' },
          withCredentials: true
        })

        if (res.data && (res.data.code === 200 || res.data > 0)) {
          ElMessage.success('思政表现保存成功')
          this.resetForm()
        } else {
          ElMessage.error(res.data.message || '保存失败，请稍后重试')
        }
      } catch (error) {
        console.error('提交失败:', error)
        ElMessage.error('提交失败，请稍后重试')
      }
    },

    resetForm() {
      this.form = {
        baseScore: null,
        bonus: null,
        deductionReason: '无',
        tutorBonus: null
      }
    }
  }
}
</script>

<style scoped>
.moral-form {
  max-width: 500px;
  margin: 0 auto;
  padding: 24px;
  background-color: #f9fafc;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
</style>
